<!-- 1 -->
<template>
	<view>
		<div class="app">
			<div class="location">
		<!-- 		<uni-icons  type="location-filled"  color="#444444"></uni-icons> -->
			<!-- 	<span class="location">当前位置</span> -->
				<!-- <image src="https://express-rider-1303869346.cos.ap-chengdu.myqcloud.com/static/image/index_icon/car.png" class="icon_car"></image> -->
		<!-- 		<span class="text">出行线路</span> -->
				<!-- <input type="text" value="中南大学(北校区)" class="inputbox" />
				<image src="https://express-rider-1303869346.cos.ap-chengdu.myqcloud.com/static/image/index_icon/arrow.png" class="icon_arrow"></image>
				<input type="text" value="长沙站" class="inputbox" /> -->
			</div>
			<div class="text" style="text-align: center;font-size: 20px;">系统派单</div>
			<div class="filter">
				<!-- <easy-select :options="freight" ref="easySelect" placeholder="订单距离" :value="selecValue" @selectOne="selectOne"></easy-select>
				<!-- <easy-select :options="time" ref="easySelect" placeholder="订单时间" :value="selecValue" @selectOne="selectOne"></easy-select> -->
<!-- 				<easy-select :options="money" ref="easySelect" placeholder="订单金额" :value="selecValue" @selectOne="selectOne"></easy-select>
				<easy-select :options="category" ref="easySelect" placeholder="配送类型" :value="selecValue" @selectOne="selectOne"></easy-select> -->
			</div>
			<view v-for="(item,index) in table" :key="index">
			<div class="expressinf">
				<div v-if="ishowitem" class="expressitem" @click='showwindow(index)'>
					<image class="img" src="../../static/logo.png"></image>
					<div class="cont">
						<div class="inf1">
							<span class="name">{{item.userName}}</span>
							<span>{{item.userPhone}}</span>
						</div>
						<div class="inf2">
							<span>订单金额￥{{item.money}}</span>
							<span>{{item.orderTime}}</span>
<!-- 							<span>全程13km</span> -->
						</div>
						<div class="inf4">
							<span>收货地址：</span>
							<span>{{comAddress}}</span>
							<uni-icons type="arrow-right" color="#95a5ac"></uni-icons>
							<span>{{item.userMapAddress}}</span>
						</div>
					</div>
				</div>
			</div>
			</view>
			<!-- 这是弹窗 -->
			<view
				v-if="paysuccess"
				class="layout-vertical-center layout-horizontal-spacebetween layout-flexdirection-colume paddingvertical-large"
				style="width: 375rpx;height: 300rpx;background-color: #ffffff !important;z-index: 10; position: fixed;top:43%;left: 50%;border-top-left-radius: 0%;transform: translate(-50%,-50%);"
			>
				<!-- <text style="font-size: 13px;margin-top: 65rpx;">查看订单详情</text> -->
				<!-- <view style="display: flex;">
					<button type="default" style="background-color:#ffbd27;color: #fff;font-size: 11px;height: 65rpx; margin-right: 10rpx;" @click="ok">确定</button>
					<button type="default" style="background-color:#ffbd27;color: #fff;font-size: 11px;height: 65rpx;margin-left: 10rpx;" @click="cancel">取消</button>
				</view> -->
			</view>
		</div>
	</view>
</template>

<script>
	import {baseUrl} from "../../libs/request.js"
export default {
	data() {
		return {
			//项目是否显示
			ishowitem:true,
			// 控制弹框输入框显示
			paysuccess: false,
			riderInfo:[],
			table:[],
			comAddress:'',
		};
	},
	onLoad() {
		this.lookRiderOrder()
	},
	methods: {
		showwindow(index){
			console.log("订单ID：",this.table[index].orderId)
			uni.setStorageSync("orderId",this.table[index].orderId)
			uni.setStorageSync("userOrderTable",this.table)
			uni.navigateTo({
				url:'../order/orderdatail?data=0'
			})
			// this.paysuccess = true;
		},
		lookRiderOrder(){
			let riderInfo = uni.getStorageSync("riderInfo")
			let riderId = riderInfo.riderid
			uni.request({
				url: baseUrl + "/riderOrder/riderOrderLookBusy",
				method: 'POST',
				data: {
					riderid: riderId,
				},
				header: {
					"Content-Type": "application/x-www-form-urlencoded"
				},
				success: (res) => {
					console.log("订单列表：",res.data.list)
					this.table = res.data.list
					if(this.table.length>0){
						this.comAddress = this.table[0].comAddress +"分店"
					}
				}
			})
		},
		// //确认下单
		// ok() {
		// 	//1，窗口消失
		// 	this.paysuccess = false;
		// 	// // 2，首页的数据消失
		// 	// this.ishowitem=false;
		// 	uni.navigateTo({
		// 		url: '../order/orderdatail'
		// 	});
			
			
		// },
		// //表示取消订单
		// cancel() {
		// 	this.paysuccess = false;
		// },
		// selectOne(options) {
		// 	this.selecValue = options.label;
		// },
		// useOutClickSide() {
		// 	this.$refs.easySelect.hideOptions && this.$refs.easySelect.hideOptions();
		// }
	}
};
</script>

<style lang="scss">
@import url('/uni.css');
.app {
	background-color: #f2f2f2;
	height: 100vh;
	.location {
		display: flex;
		align-items: center;
		// justify-content: space-between;
		.icon_car {
			width: 20px;
			height: 20px;
		}
		.icon_arrow {
			width: 15px;
			height: 15px;
		}
		.text {
			font-size: 12px;
		}
		.location {
			text-align: left;
			font-size: 12px;
		}
		.inputbox {
			background-color: #fff;
			font-size: 12px;
			width: 60px;
		}
	}
	.text {
		font-size: 14px;
		margin-left: 20rpx;
		margin-top: 10px;
		margin-bottom: 5px;
	}
	.filter {
		box-sizing: border-box;
		padding-left: 10rpx;
		padding-right: 10rpx;
		display: flex;
		justify-content: space-between;
		.item {
			flex: 1;
		}
	}
	.expressinf {
		padding-left: 10rpx;
		padding-right: 10rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		.expressitem {
			width: 90%;
			display: flex;
			align-items: center;
			margin-top: 10px;
			border-bottom: 1px solid #d9dbeb;
			background-color: #ffffff;
			border-radius: 10px;
			padding: 15rpx;
			.img {
				width: 160rpx;
				height: 150rpx;
				border-radius: 4px;
			}
			.cont {
				margin-left: 10px;
				.inf1 {
					display: flex;
					align-items: center;
					font-size: 12px;
					.name {
						margin-right: 5px;
						font-weight: 700;
					}
					.num {
						margin-left: 20px;
						font-size: 10px;
						color: #95a5ac;
					}
				}
				.inf2 {
					margin-top: 5rpx;
					display: flex;
					color: #95a5ac;
					font-size: 10px;
					span {
						margin-right: 5px;
					}
				}
				.inf3 {
					.tag-right {
						margin-left: 10rpx;
					}
				}
				.inf4 {
					margin-top: 5rpx;
					display: flex;
					align-items: center;
					font-size: 10px;
					color: #95a5ac;
				}
			}
		}
	}
}
</style>
